<template>
	<view class="bg main">
		<Header :menuSelect="'三相电'"></Header>
		<view class="container padd-24">
			<TPowerCard v-for="(item, index) in TPowerList" :key="index" :data="item" :index="index" />
		</view>
	</view>
</template>
<script setup lang="ts">
	import { computed, ref } from 'vue';
	import Header from '@/components/header.vue';
	import TPowerCard from '@/components/TPowerCard.vue';
	const TPowerList = ref([
		{
			title: '主电机功率监测',
			power: 49.6,
			power1: 45.6,
			powerFactor: 0.92,
			powerFactor1: 0.92,
			voltage: 63,
			voltage1: 60,
		}, {
			title: '主电机功率监测',
			power: 49.6,
			power1: 45.6,
			powerFactor: 0.92,
			powerFactor1: 0.92,
			voltage: 63,
			voltage1: 60,
		}, {
			title: '主电机功率监测',
			power: 49.6,
			power1: 45.6,
			powerFactor: 0.92,
			powerFactor1: 0.92,
			voltage: 63,
			voltage1: 60,
		}, {
			title: '主电机功率监测',
			power: 49.6,
			power1: 45.6,
			powerFactor: 0.92,
			powerFactor1: 0.92,
			voltage: 63,
			voltage1: 60,
		}, {
			title: '主电机功率监测',
			power: 49.6,
			power1: 45.6,
			powerFactor: 0.92,
			powerFactor1: 0.92,
			voltage: 63,
			voltage1: 60,
		},
	])
</script>
<style scoped lang="scss">
	.main {
		height: 100vh;

		.container {
			padding: 24px;
			display: flex;
			flex-wrap: wrap;
			gap: 32rpx 72rpx;
		}
	}
</style>